<%@ page language="java" import="java.util.*,com.bgt.*"
	pageEncoding="UTF-8"%>
<%@ include file="/page/comm/comm.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript" src="<%=basePath %>/js/bgt/bgtutils.js"></script>
<script type="text/javascript">
var userdatagrid;
var editRow = undefined; //定义全局变量：当前编辑的行
$(function(){
	userdatagrid=  $('#myusers').datagrid({
	    title:'用户列表',
	    iconCls:'icon-ok',
	    width:500,
	    async:true,
	    height:320,
	    pagination:true,
	    pageSize:10,
	    pageList:[10,4,6,8],
	    fit:true,
	    fitColumns:false,//设置滚动条开启
	    nowrap:false,
	    idFiled:'id',//翻页的时候选择
	    url:'mUserAction!UserList.action',
	    loadMsg:'数据装载中......',
	    frozenColumns:[[
	                    {field:'id',title:'主键',width:80, checkbox: true},
	                ]],
       columns:[[
           {field:'userName',title:'用户名',width:80,align:'right',sortable:true,
        	   editor:{
        		   type:'validatebox',
        		   options:{
        			   required:true
        		   }
        	   }},
           {field:'passWord',title:'密码',width:80,align:'right'},
       ]],
       toolbar:[
                {
                	text:"增加",
                	iconCls:"icon-save",
                	handler:function(){
                		console.info("add");
                		if(editRow!=undefined){
                			userdatagrid.datagrid('endEdit',editRow);
                		}
                		 //当无编辑行时
                        if (editRow == undefined) {
                        	userdatagrid.datagrid('addEditor',{
                        		field:'passWord',
                        		editor:{
                        			type:'validatebox',
                        			options:{
                        				required:true
                        			}
                        		}
                        	});
	                		userdatagrid.datagrid("insertRow",{
	                			index:0,
	                			row:{
	                				id:'',
	                			userName:'',
	                			passWord:''
	                			}
	                		});
	                		userdatagrid.datagrid('beginEdit',0);
	                		editRow=0;
                        }
                		/* //追加到最后
                		userdatagrid.datagrid("appendRow",{
                			id:'',
                			userName:'',
                			passWord:''
                		});
                		var rows=userdatagrid.datagrid('getRows');
                		userdatagrid.datagrid('beginEdit',rows.length-1); */
                	}
                }, '-',
                {
                	text:"修改",
                	iconCls:"icon-edit",
                	handler:function(){
                		console.info("edit");
                		  var rows = userdatagrid.datagrid("getSelections");
                          //如果只选择了一行则可以进行修改，否则不操作
                          if (rows.length == 1) {
                        	  userdatagrid.datagrid('removeEditor','passWord');
                              //修改之前先关闭已经开启的编辑行，当调用endEdit该方法时会触发onAfterEdit事件
                              if (editRow != undefined) {
                            	  userdatagrid.datagrid("endEdit", editRow);
                              }
                              //当无编辑行时
                              if (editRow == undefined) {
                                  //获取到当前选择行的下标
                                  var index = userdatagrid.datagrid("getRowIndex", rows[0]);
                                  //开启编辑
                                  userdatagrid.datagrid("beginEdit", index);
                                  //把当前开启编辑的行赋值给全局变量editRow
                                  editRow = index;
                                  //当开启了当前选择行的编辑状态之后，
                                  //应该取消当前列表的所有选择行，要不然双击之后无法再选择其他行进行编辑
                                  userdatagrid.datagrid("unselectAll");
                              }
                          }
                	}
                }, '-',
                {
                	text:"查询",
                	iconCls:"icon-search",
                	handler:function(){
                		console.info("search")
                	}
                }, '-',
                {
                	text:"删除",
                	iconCls:"icon-remove",
                	handler:function(){
                		console.info("del")
                		 var rows = userdatagrid.datagrid("getSelections");
                		if(rows.length>0){
                			$.messager.confirm('确认','您确认要删除吗？',function(b){
                				if(b){
                					var ids=[];
                					for(var i=0;i<rows.length;i++){
                						ids.push(rows[i].id);
                					}
                					console.info(ids.join(','));
                				}
                			});
                		}else{
                			$.messager.alert("提示",'请选择要删除的记录','error');
                		}
                	}
                }, '-',
                {
                	text:"保存",
                	iconCls:"icon-save",
                	handler:function(){
                		console.info("保存")
                		  editRow =undefined;
                		userdatagrid.datagrid('rejectChanges');
                		userdatagrid.datagrid('unselectAll');
                	}
                }
                ],
               onAfterEdit:function(rowIndex,rowData,changes){
            	   var inserted=userdatagrid.datagrid('getChanges','inserted');
            	   var updated=userdatagrid.datagrid('getChanges','updated');
            	   var url="";
            	   if(inserted.length>0){
            		   url="mUserAction!addUser.do";
            	   }
            	   if(updated.length>0){
            		   url="mUserAction!addUser.do";
            	   }
            	   $.ajax({
           			url:url,
           			data:rowData,
           			type:"post",
           			dataType: 'json',
           			success:function(data){
           				console.info(data);
           				if(data.dataMap.success){
           					$.messager.alert("提示",data.dataMap.msg);
           					userdatagrid.datagrid('acceptChanges');
           				}else{
           					$.messager.alert("提示",data.dataMap.msg);
           				}
           			}
           		});
            	   editRow =undefined;
               },onDblClickRow:function(rowIndex,rowData,changes){
            	   if(editRow!=undefined){
           			userdatagrid.datagrid('endEdit',rowIndex);
           		}
           		 //当无编辑行时
                   if (editRow == undefined) {
                	   userdatagrid.datagrid('beginEdit',rowIndex);
               			editRow=rowIndex;
                   }
               }
	   });
	  });
	  
	 </script>
	 <div class="easyui-layout" fit="true" border="false">
	 <div region="north" border="false" title="查询条件" style="height:110px;overflow:hidden;">
	 <form id="usersearch">
	 	<table>
	 		<tr>
	 		<td>用户名:</td>
	 		<td><input type="text" name="userName" id="suname"/></td>
	 		</tr>
	 		<tr>
	 		<td> </td>
	 		<td><a href="#" class="easyui-linkbutton" onclick="usearch()">查询</a></td>
	 		</tr>
<!-- 	 		<tr>
	 		<td></td>
	 		<td></td>
	 		</tr> -->
	 	</table>
	 </form>
	 </div>
	 <div region="center" border="false">
	 	<table id="myusers">
    
    	</table>
	 </div>
	 </div>
	 <script type="text/javascript">
	 	function usearch(){
	 		userdatagrid.datagrid('load',{
	 			name:$('#suname').val()
	 		});
	 	}
	 </script>
</body>
</html>